<template>
    <view style="width: 750rpx; height: 100vh; border: 1px solid red;padding-top:100px;">
        <button @click="select">选择图片</button>
        <image mode="widthFix" :src="path" />
         <!-- watermark="水印来了"
            :watermarkType="1" -->
        <croppera
            mode="free"
            :width="200"
            :height="200"
            :maxWidth="1024"
            :maxHeight="1024"
            :url="imgurl"
            @cancel="cancel"
            @ok="complete"
        ></croppera>
    </view>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { onShow, onLoad } from '@dcloudio/uni-app'
import croppera from './croppera'
const imgurl = ref('');
const path = ref('');


const complete = (ev)=>{
    console.log('complete');
    console.log('complete');
    console.log('complete');
    console.log(ev);
    imgurl.value = "";
    path.value = ev.path;
    
}

const cancel = ()=>{
    imgurl.value = "";
}

const select=()=>{
                uni.chooseImage({
                    count: 1,
                    success: (rst) => {
                        // 设置url的值，显示控件
                        imgurl.value = rst.tempFilePaths[0];
                    }
                }); 
}


onLoad(()=>{

})

</script>